import { PureComponent } from 'react';
import PropTypes from 'prop-types';
import UnifiedHunk from './UnifiedHunk';
import SplitHunk from './SplitHunk';
import { createHunkEventsSelector, createHunkClassNamesSelector } from './selectors';
import { viewTypePropType, eventsPropType, hunkPropType } from './propTypes';
import './Hunk.css';

export default class Hunk extends PureComponent {
  static propTypes = {
    viewType: viewTypePropType,
    hunk: hunkPropType.isRequired,
    header: PropTypes.oneOfType([
      PropTypes.node,
      PropTypes.shape([PropTypes.node, PropTypes.node]),
    ]),
    widgets: PropTypes.objectOf(PropTypes.element),
    selectedChanges: PropTypes.arrayOf(PropTypes.string),
    customEvents: eventsPropType,
  };

  static defaultProps = {
    viewType: 'split',
    widgets: {},
    selectedChanges: [],
    customEvents: {},
  };

  selectEvents = createHunkEventsSelector();

  selectClassNames = createHunkClassNamesSelector();

  render() {
    const { viewType, customEvents, customClassNames, ...props } = this.props;
    // 当前diff是删除或新增的文件，双栏模式也用单栏模式显示
    // 任务：https://teambition.alibaba-inc.com/task/5e9c548bf2816834d6e5b87c
    const is_deleted_or_new_file = props.curDiff
      ? props.curDiff.new_file || props.curDiff.deleted_file
      : false;
    const RenderingHunk =
      viewType === 'unified' || is_deleted_or_new_file ? UnifiedHunk : SplitHunk;
    const { headerGutterEvents, headerContentEvents, otherEvents } =
      this.selectEvents(customEvents);
    const {
      hunkClassName,
      headerClassName,
      headerGutterClassName,
      headerContentClassName,
      otherClassNames,
    } = this.selectClassNames(customClassNames);

    return (
      <RenderingHunk
        {...props}
        headerGutterEvents={headerGutterEvents}
        headerContentEvents={headerContentEvents}
        className={hunkClassName}
        headerClassName={headerClassName}
        headerGutterClassName={headerGutterClassName}
        headerContentClassName={headerContentClassName}
        customEvents={otherEvents}
        customClassNames={otherClassNames}
      />
    );
  }
}
